import { GetProps, Select } from 'antd'
import { CustomCellEditorProps } from '@ag-grid-community/react'

import styles from './styles.module.less'

type TSelectProps = GetProps<typeof Select>

interface ISelectCellEditorProps extends CustomCellEditorProps<any, string | number> {
  selectProps?: Omit<TSelectProps, 'open' | 'onDropdownVisibleChange' | 'value' | 'onChange' | 'size'>
}

export const SelectCellEditor = Object.assign(
  ({ api, value, onValueChange, selectProps }: ISelectCellEditorProps) => {
    return (
      <Select
        {...selectProps}
        className={styles.SelectCellEditor}
        value={value as any}
        onChange={val => onValueChange(val as any)}
        open
        onDropdownVisibleChange={open => {
          if (!open) api.stopEditing()
        }}
      />
    )
  },
  {
    defineProps: (props: Pick<ISelectCellEditorProps, 'selectProps'>): Pick<ISelectCellEditorProps, 'selectProps'> =>
      props,
  },
)
